<template id="paySign">

  <div class="paySign">
    <div class="row">
        <div class="col paySignHeader">
          <p class="col_333">已签约项目</p>
        </div>
    </div>

    <div class="row paySignListBox" v-for="item in paySignData" :key="item.corpId">
      <div class="col paySignList">
        <router-link :to="{path:'/pay/signed', query: {id: item.corpId}}">
          <img class="border-radious-img"  :src="item.logoFile" v-if="item.logoFile">
          <img class="border-radious-img"  src="../../../static/image/pay_sign.png" v-else="">
          <span class="col_333">{{item.corpName}}</span>
        </router-link>
      </div>
    </div>

    <!--添加缴费用户-->
    <div class="row paySignListBox">
      <div class="col paySignList">
        <router-link to="/pay/contactList">
          <i class="icon iconfont icon-add">&#xe6e8;</i><span class="col_333" style="line-height: 62px">添加缴费用户</span>
        </router-link>
      </div>
    </div>
  </div>
</template>

<script>
  import urlAll from '../../js/kj_url'
  import serviceApi from '../../js/ajax'
  export default {
    data () {
      return {
        paySignData: []

//          paySignData:[
//            {
//              paySignID:1,
//              imgSrc:zgyh,
//              paySignName:'山东省分行党务'
//            },
//            {
//              paySignID:2,
//              imgSrc:sdwx,
//              paySignName:'山东省青岛第二卫生学校'
//            },
//            {
//              paySignID:3,
//              imgSrc:fsq,
//              paySignName:'福山区小红花假日风景幼儿园'
//            }
//          ]
      }
    },
    methods: {

    },
    //获取后台数据，dom渲染之前
    created: function(){
      var that = this;
      this.$post(this.$urlAll.sign_project, {openAccount: sessionStorage.getItem('userId')}).then(function (response) {
        that.paySignData = response.t.paymentSignProject;
      })
    },
    //渲染dom
    mounted: function () {

    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  @import "../../style/common.css";
  @import "../../assets/css/iconfont.css";

.paySignHeader{
  height: 0.44rem;
}
.paySignHeader p {
 font-size: 0.14rem;
  line-height: 0.44rem;
  padding-left: 0.1rem;
}
  .paySignListBox{
    padding: 0 0.1rem;
    margin-bottom: 0.15rem;
  }
  .paySignList{
    background-color: #ffffff;
    height: 0.62rem;
    -webkit-box-shadow: 0px 0px 9px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 0px 9px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 9px rgba(0,0,0,0.1);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding-left: 0.1rem;
    position: relative;

  }
  .paySignList a{
    display: inline-block;
    height: 100%;
    width: 100%;

  }
  .paySignList img{
    width: 0.4rem;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    line-height: 0.62rem;
    /*padding-right: 0.1rem;*/
  }
  .paySignList a span{
    font-size: 0.15rem;
    padding: 0 0.1rem;
    position: absolute;
    left: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
  }
 .icon-add {
  font-size: 0.4rem;
   line-height: 0.62rem;
   color: #888;
}
</style>
